<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8"/>
    <link rel='stylesheet' href='public/stylesheets/index.css'/>
</head>
<body>
<header>
    <div class="headerLeft">
        <img src="public/images/znxl.png" alt="">
        <p>赞控工具                        zk v0.0.0文档</p>
    </div>
</header>
<section>
    <!---->
    <div class="sectionList">
        <ul id="appManager" style="width:160px;">
            <!--app-->
            <li>
                <button onclick="showFragment(this,`app/index.html`);$(this).next().toggle(300)">app</button>
                <ul style="display: none">
                    <li onclick="showFragment(this,`app/console/index.html`)">
                        <p>console</p>
                    </li>
                    <li onclick="showFragment(this,`app/fetch/index.html`)">
                        <p>fetch</p>
                    </li>
                    <li onclick="showFragment(this,`app/localStorage/index.html`)">
                        <p>localStorage</p>
                    </li>
                    <li onclick="showFragment(this,`app/cache/index.html`)">
                        <p>cache</p>
                    </li>
                    <li onclick="showFragment(this,`app/code/index.html`)">
                        <p>code</p>
                    </li>
                    <li onclick="showFragment(this,`app/media/index.html`)">
                        <p>media</p>
                    </li>
                    <li onclick="showFragment(this,`app/vibrator/index.html`)">
                        <p>vibrator</p>
                    </li>
                    <li onclick="showFragment(this,`app/setTimeout/index.html`)">
                        <p>setTimeout</p>
                    </li>
                    <li onclick="showFragment(this,`app/version/index.html`)">
                        <p>version</p>
                    </li>
                    <li onclick="showFragment(this,`app/socket/index.html`)">
                        <p>socket</p>
                    </li>
                    <li onclick="showFragment(this,`app/stack/index.html`)">
                        <p>stack</p>
                    </li>
                    <li onclick="showFragment(this,`app/alert/index.html`)">
                        <p>alert</p>
                    </li>
                </ul>
            </li>
            <!--document-->
            <li>
                <button onclick="showFragment(this,`document/index.html`);$(this).next().toggle(300);">document</button>
                <ul style="display: none">
                    <li onclick="showFragment(this,`document/plain/index.html`)">
                        <p>plain</p>
                    </li>
                    <li onclick="showFragment(this,`document/viewPage/index.html`)">
                        <p>viewPage</p>
                    </li>
                    <li onclick="showFragment(this,`document/dialog/index.html`)">
                        <p>dialog</p>
                    </li>
                    <li onclick="showFragment(this,`document/fra/index.html`)">
                        <p>fra</p>
                    </li>
                    <li onclick="showFragment(this,`document/popupWindow/index.html`)">
                        <p>popupWindow</p>
                    </li>
                </ul>
            </li>
            <!--view-->
            <li>
                <button onclick="showFragment(this,`view/index.html`);$(this).next().toggle(300);">view</button>
                <ul style="display: none">
                    <li>
                        <p onclick="showFragment(this,`view/text/index.html`);$(this).next().toggle(300)">text(50%,目前只写了style-1,方法没写)</p>
                        <ul style="display: none">
                            <li onclick="showFragment(this,`view/text/text1.html`)">text1</li>
                            <li onclick="showFragment(this,`view/text/text2.html`)">text2</li>
                            <li onclick="showFragment(this,`view/text/text3.html`)">text3</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/group/index.html`);$(this).next().toggle(300)">group(20%,测试了style-1,方法没写,属性没定,方法定义有点困难)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/group/group1.html`)">group1</li>
                            <li  onclick="showFragment(this,`view/group/group2.html`)">group2</li>
                            <li  onclick="showFragment(this,`view/group/group3.html`)">group3</li>
                            <li  onclick="showFragment(this,`view/group/group4.html`)">group4</li>
                            <li  onclick="showFragment(this,`view/group/group5.html`)">group5</li>
                            <li  onclick="showFragment(this,`view/group/group6.html`)">group6</li>
                            <li  onclick="showFragment(this,`view/group/group7.html`)">group7</li>
                            <li  onclick="showFragment(this,`view/group/button.html`)">button</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/p/index.html`)">p(完成80%,方法没写,属性字符串没做)</p>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/img/index.html`)">img(完成80%,方法没写,属性可能有变)</p>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/input/index.html`)">input(完成70%,方法没写,属性字符串没做,背景框定义有困难)</p>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/card/index.html`);$(this).next().toggle(300)">card(70%,方法没写,属性定义差个背景图片)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/card/card1.html`)">card1</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/face/index.html`);$(this).next().toggle(300)">face(未做)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/face/face1.html`)">face1</li>
                            <li  onclick="showFragment(this,`view/face/face2.html`)">face2</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/hint/index.html`);$(this).next().toggle(300)">hint(未做)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/hint/hint1.html`)">hint1</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/layout/index.html`);$(this).next().toggle(300)">layout(完成90%,方法未定义)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/layout/layout1.html`)">layout1</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/recycle/index.html`);$(this).next().toggle(300)">recycle(完成90%)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/recycle/recycle1.html`)">recycle1</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/script/index.html`);$(this).next().toggle(300)">script(完成90%,暂不支持网络路径)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/script/script1.html`)">script1</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/rating/index.html`);$(this).next().toggle(300)">rating评分(未做)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/rating/rating.html`)">rating1</li>
                            <li  onclick="showFragment(this,`view/rating/rating2.html`)">rating2</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/switch/index.html`);$(this).next().toggle(300)">switch(未做)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/switch/switch1.html`)">switch1</li>
                            <li  onclick="showFragment(this,`view/switch/switch2.html`)">switch2</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/timedown/index.html`);$(this).next().toggle(300)">tiemdown(未做)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/timedown/timedown1.html`)">tiemdown1</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/webView/index.html`);$(this).next().toggle(300)">web(80%,照搬的以前的,方法不全)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/webView/webView1.html`)">webView1</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/video/index.html`);$(this).next().toggle(300)">video(未做)</p>
                        <ul style="display: none">
                            <li  onclick="showFragment(this,`view/video/video1.html`)">video1</li>
                            <li  onclick="showFragment(this,`view/video/video2.html`)">video2</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/checkbox/index.html`);$(this).next().toggle(300)">checkbox(未做,应该和switch合并)</p>
                        <ul style="display: none">
                            <li onclick="showFragment(this,`view/checkbox/checkbox1.html`)">checkbox1</li>
                            <li onclick="showFragment(this,`view/checkbox/checkbox2.html`)">checkbox2</li>
                        </ul>
                    </li>

                    <li>
                        <p onclick="showFragment(this,`view/range/index.html`);$(this).next().toggle(300)">range进度条(未做)</p>
                        <ul style="display: none">
                            <li onclick="showFragment(this,`view/range/range.html`)">track1</li>
                            <li onclick="showFragment(this,`view/range/range2.html`)">track2</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/numberpicker/index.html`);$(this).next().toggle(300)">numberpicker(未做)</p>
                        <ul style="display: none">
                            <li onclick="showFragment(this,`view/numberpicker/numberpicker3.html`)">numberpicker1</li>
                            <li onclick="showFragment(this,`view/numberpicker/numberpicker4.html`)">numberpicker2</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/picker/index.html`);$(this).next().toggle(300)">picker(未完成)</p>
                        <ul style="display: none">
                            <li onclick="showFragment(this,`view/picker/picker1.html`)">picker1</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/banner/index.html`);$(this).next().toggle(300)">banner(完成60% 方法没写)</p>
                        <ul style="display: none">
                            <li onclick="showFragment(this,`view/banner/banner.html`)">banner</li>
                        </ul>
                    </li>
                    <li>
                        <p onclick="showFragment(this,`view/viewpage/index.html`);$(this).next().toggle(300)">viewpage(完成60% 方法没写)</p>
                        <ul style="display: none">
                            <li onclick="showFragment(this,`view/viewpage/viewpage.html`)">viewpage1</li>
                        </ul>
                    </li>
                </ul>

            </li>
            <!--adapter-->
            <li>
                <button onclick="showFragment(this,`item/index.html`)">item</button>
            </li>
            <!--sdk-->
            <li>
                <button onclick="showFragment(this,`sdk/index.html`);$(this).next().toggle(300)">sdk</button>
                <ul style="display: none">
                    <li onclick="showFragment(this,`sdk/aliPay/index.html`)">aliPay</li>
                    <li onclick="showFragment(this,`sdk/callLive/index.html`)">callLive</li>
                    <li onclick="showFragment(this,`sdk/WeChat/index.html`)">WeChat</li>
                </ul>
            </li>
            <!--大组件-->
            <li>
                <button onclick="showFragment(this,`component/index.html`);$(this).next().toggle(300)">component</button>
                <ul style="display: none">
                    <li onclick="showFragment(this,`component/chat/index.html`)">chat</li>
                </ul>
            </li>
            <!--大组件-->
            <li>
                <button onclick="showFragment(this,`service/index.html`);$(this).next().toggle(300)">service</button>
                <ul style="display: none">
                    <li onclick="showFragment(this,`service/context.html`)">context</li>
                    <li onclick="showFragment(this,`service/ctx.html`)">ctx</li>
                    <li onclick="showFragment(this,`service/naive.html`)">naive</li>
                </ul>
            </li>
        </ul>
    </div>
    <div class="sectionMain">
        <iframe id="external-frame" style="height:800px;width:100%" frameborder="0"></iframe>
    </div>
</section>
<footer>
    <div id="barcon" name="barcon"></div>
</footer>
<script src="js/script_min.js"></script>
<script src="js/util.js"></script>
<script>
    let oldDoc;
    let showFragment = (doc,page)=>{
        $('#external-frame').attr("src",page);
        if(!oldDoc){
            oldDoc = doc;
            $(oldDoc).css("background","#00ff00")
        }else{
            $(oldDoc).css("background","#ffffff");
            $(doc).css("background","#00ff00");
            oldDoc = doc;
        }
    };
</script>

</body>
</html>
